import { useEffect } from "react"
import { useState } from "react"
const URL = 'http://geek.itheima.net/v1_0/channels'

function App() {
    // 创建状态数据
    const [list, setList] = useState([])
    useEffect(() => {
        // 额外的操作 获取频道列表 发送网络请求
        async function getlist() {
            const res = await fetch(URL)
            const jsonRes = await res.json()
            console.log(jsonRes);
            setList(jsonRes.data.channels)
        } getlist()
    }, [])//空数组时，前面只会执行一次
    return (
        <div>
            this is app
            <ul>
                {list.map(item => <li key={item.id}>{item.name}</li>)}
            </ul>
        </div>
    )
}
export default App